import { HooksDemos } from '@docs/demos';
import { Layout } from '@/layout';
import { MDX_DATA } from '@/mdx';

export default Layout(MDX_DATA.useHover);

## Usage

<Demo data={HooksDemos.useHoverDemo} />

## Definition

```tsx
interface UseHoverReturnValue<T extends HTMLElement = any> {
  hovered: boolean;
  ref: React.RefCallback<T | null>;
}

function useHover<T extends HTMLElement = any>(): UseHoverReturnValue<T>
```

## Exported types

`UseHoverReturnValue` type is exported from `@mantine/hooks` package,
you can import it in your application:

```tsx
import type { UseHoverReturnValue } from '@mantine/hooks';
```
